div.energy-core {
    @color-selected: lighten(@color-energy-core, 30%);

    position: relative;
    background-color: @color-energy-core;
    border-radius: 2em;
    margin: 1em;
    padding: 0.5em;
    min-width: 10rem;
    font-weight: 900;
    font-size: 0.65em;
    overflow: hidden;
    box-shadow: inset 1em 0 0 @color-selected,
        inset -1em 0 0 @color-selected;

    transition: 300ms background-color;

    & > div{
        z-index: 1;
    }

    &.selected{
        background-color: @color-selected;
    }

    &, h3{
        .create-text-outlined(@font-family-header);
    }

    h3, button{
        font-size: 180%;
    }

    h3{
        padding: 0.25em;
    }

    .progress-bar{
        margin: 1em 0;
    }

    .background-core{
        .create-background-image(80%, 0.5, 20%, 20%);
    }

    button {
        .create-button(lighten(@color-energy-core, 5%));
    }

    .locked{
        font-size: 275%;
    }

    .boost{
        font-size: 250%;
        .create-text-outlined(@font-family-header);
    }
}